<template>
	<view>
		<u--form class="form" ref="myFormRef"  :model="formData">
			<u-form-item label="账户ID" labelWidth="140" prop="mobile">
				<u--input placeholder="请输入账户ID" border="bottom" v-model="formData.accid" type="number"
					suffixIcon="phone"></u--input>
			</u-form-item>
			<u-form-item>
				<u-button @click="setConnect({accid: formData.accid,bool: !connect})" 
				:type="connect ? 'warning' : 'primary'" 
				:text="connect ? '登出' : '登录'" 
				class="input"></u-button>
			</u-form-item>
		</u--form>
		<u--form class="form" ref="myFormRef"  :model="formData">
			<u-form-item label="群名称" labelWidth="140" prop="mobile">
				<u--input placeholder="请输入群名称" border="bottom" v-model="formData.name"
					suffixIcon="phone"></u--input>
			</u-form-item>
			<u-form-item>
				<u-button @click="createTeam({name: formData.name})" type="primary" text="创建群" class="input"></u-button>
			</u-form-item>
		</u--form>
		<u--form class="form" ref="myFormRef"  :model="formData">
			<u-form-item label="群ID" labelWidth="140" prop="mobile">
				<u--input placeholder="请输入群ID" border="bottom" v-model="teamId" type="number"
					suffixIcon="phone"></u--input>
			</u-form-item>
			<u-form-item>
				<u-button @click="applyTeam({teamId})" type="primary" text="加入群" class="input"></u-button>
			</u-form-item>
		</u--form>
		<u--form class="form" ref="myFormRef"  :model="formData">
			<u-form-item label="消息" labelWidth="140" prop="mobile">
				<u--input placeholder="请输入消息" border="bottom" v-model="message"
					suffixIcon="phone"></u--input>
			</u-form-item>
			<u-form-item>
				<u-button @click="sendMessage({body: message,to:teamId})" type="primary" text="发送消息" class="input"></u-button>
			</u-form-item>
		</u--form>
		<u-button @click="handlePush" text="系统消息推送"></u-button>
		<message-list :model-value="messages"></message-list>
	</view>
</template>

<script lang="ts" setup>
	import {reactive,ref} from "vue";
	import setupNim from "@/util/nim";
	import MessageList from "@/components/team/message-list.vue";
	
	const message = ref("");
	
	const {connect,setConnect, createTeam, teamId,applyTeam,sendMessage,messages} = setupNim();
	// 这个是创建出来测试的群ID，也可以自己创建
	teamId.value = "12765087550";
	
	const formData = reactive({
		accid: '1',
		name: "测试群"
	});
	
	const handlePush = () => {
		uni.createPushMessage({
			title:"测试消息",
			content: "测试消息的内容",
			fail(err) {
				console.log(err)
			},
			success() {
				console.log("推送成功")
			}
		});
	}

</script>

<style>

</style>
